<template>
    <example :template-code="templateString">
        <template #describe>
            <t :id="`${$t('基础示例')}`">{{ $t('基础示例') }}</t>
        </template>
        <sib-item v-model="value" :props="props"></sib-item>
    </example>
</template>

<script>
import { ref, reactive } from 'vue';
import { ElMessage } from 'element-plus';

export default {
    setup() {
        const value = ref([{ name: '帅照1.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' }]);
        const props = reactive({
            type: 'upload',
            action: 'http://dev.api.sisensing.com/system/vip/card/import',
            data: { key: '666' },
            onSuccess: (res, file, fileList) => {
                console.log('res, file, fileList: ', res, file, fileList);
                if (res.code === 400) {
                    ElMessage.error('上传失败');
                    return;
                }
                ElMessage.success('上传成功');
            },
            onError: (err) => {
                console.log('err: ', err);
                ElMessage.error('上传失败');
            },
        });

        return {
            props,
            value,
            templateString: `<template>
    <sib-item v-model="value" :props="props"></sib-item>
</template>

<script>
import { ref, reactive } from 'vue';
import { ElMessage } from 'element-plus';

export default {
    setup() {
        const value = ref([{ name: '帅照1.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' }]);
        const props = reactive({
            type: 'upload',
            action: 'http://dev.api.sisensing.com/system/vip/card/import',
            data: { key: '666' },
            onSuccess: (res, file, fileList) => {
                console.log('res, file, fileList: ', res, file, fileList);
                if (res.code === 400) {
                    ElMessage.error('上传失败');
                    return;
                }
                ElMessage.success('上传成功');
            },
            onError: (err) => {
                console.log('err: ', err);
                ElMessage.error('上传失败');
            },
        });

        return { props, value };
    },
};
<\/script>`,
        };
    },
};
</script>
